<template>
  <div class="two_activity">
    <div class="warn-box">
      <svg-icon
        style="margin-right:17px"
        icon-class="warn"
        :size="20"
      />
      <p><span>图片要求！</span><br />图片宽度335px，高度160px。</p>
    </div>
    <div
      v-for="(item, index) in imgList"
      :key="index"
      class="text-center item_wrap"
    >
      <div class="text-left header">
        <span style="color:#666666">图片{{index+1}}</span>
      </div>
      <crop-upload
        class="w-100 img_wrap"
        show-type="photo"
        :init-val="item.img"
        wrapper-width="359px"
        wrapper-height="171px"
        :img-width="335"
        :img-height="160"
        :photo-width="359"
        :photo-height="171"
        @setVal="(val)=>{item.img=val}"
      ></crop-upload>
      <div class="input_wrapper">
        <div class="flex price">
          <label class="flex align-center justify-center"><span class="required-icon">*</span>链接</label>
          <el-input
            placeholder="请输入链接"
            v-model="item.jumpUrl"
            clearable
          >
          </el-input>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import cropUpload from "@/components/cropUpload";
export default {
  components: { cropUpload },
  data() {
    return {
      imgList: [
        {
          img: '',
          jumpUrl: ''
        },
        {
          img: '',
          jumpUrl: ''
        }
      ]
    }
  }
}
</script>

<style lang="scss" scoped>
.item_wrap .input_wrapper {
  margin-left: 0;
}
.img_wrap {
  margin: 10px 0;
}
</style>
